<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div>
    <h1>The Ajax 03 page</h1>
    <fieldset>
        <legend>表单请求</legend>
        <form enctype="application/x-www-form-urlencoded">
            <input type="text" name="name" id="nameId" onblur="doCheck()">
            <button onclick="save()" type="button"> 提交</button>
        </form>
        <span id="result"></span>
    </fieldset>
</div>

</body>
<script>

    function get(url,params,callback) {
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function(){
            if(xhr.readyState==4){
                callback(xhr.responseText);
                document.getElementById( "result").innerHTML= "<font color='red'>" ++ "</font>";
            }
        }

        xhr.open("GET",`${url}?${params}`,true);
        xhr.send();
    }

    function post(url,params,callback) {
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function(){
            if(xhr.readyState==4){
                callback(xhr.responseText);
            }
        }
        let name=document.getElementById("nameId").value;
        xhr.open("Post",url,true);
        xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
        xhr.send(params);
    }
    function doCheck() {

    }

    function save() {

        post("/doSave",`name=${name}`,function (result) {
            document.getElementById("result").innerText=result;
        })
    }
</script>
</html>